<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title>Your Page Title</title>

<script src="../../jsplugins/jquery-1.7.2.js" type="text/javascript"></script>

<!-- layout -->
<link href="../../css/main_layout.css" rel="stylesheet" type="text/css" />
<!--[if lte IE 7]>
		<link href="../../css/patches/patch_my_layout.css" rel="stylesheet" type="text/css" />
		<![endif]-->

<!-- Menu -->
<link type="text/css" rel="stylesheet"
	href="../../jsplugins/mega-menu/css/skins/black.css" />
<script
	src="../../jsplugins/mega-menu/js/jquery.hoverIntent.minified.js"
	type="text/javascript"></script>
<script src="../../jsplugins/mega-menu/js/jquery.dcmegamenu.1.3.3.js"
	type="text/javascript"></script>

<!-- Tree -->
<script type="text/javascript"
	src="../../jsplugins/jstree/jquery.jstree.js"></script>
<script type="text/javascript"
	src="../../jsplugins/jstree/_lib/jquery.hotkeys.js"></script>
<script type="text/javascript"
	src="../../jsplugins/jstree/_lib/jquery.cookie.js"></script>
<link type="text/css" rel="stylesheet"
	href="../../jsplugins/jstree/_docs/!style.css" />
</head>
<body>
	<div class="page_margins">
		<div id="topnav" align="right">
			<!-- start: skip link navigation -->
			<a class="skip" title="skip link" href="#navigation">Skip to the
				navigation</a> <span class="hideme">.</span> <a class="skip"
				title="skip link" href="#content">Skip to the content</a> <span
				class="hideme">.</span>
			<!-- end: skip link navigation -->
			<a href="#">Login</a> | <a href="#">Contact</a> | <a href="#">Imprint</a>
			<br />
		</div>
		<div class="page">
			<div id="header">header</div>
			<div id="menu-bar" class="black">

				<ul id="mega_menu" class="mega-menu">
					<li><a href="#">Main</a></li>
					<li id="li_referenceData"><a href="#">Shopping</a>
						<ul>
							<li><a>Product</a>
								<ul>
									<li><a
										href="common/entryAssetAction.action?type=basic_quote">Fish</a>
									</li>
									<li><a href="common/cateShowAction.action?type=commodity">Dog</a>
									</li>
									<li><a href="common/cateShowAction.action?type=future">Reptile</a>
									</li>
									<li><a href="common/cateShowAction.action?type=future">Cat</a>
									</li>
								</ul></li>
							<li><a>Bulk</a>
								<ul>
									<li><a href="bulk/bulk_upload.jsp">Bulk Upload</a></li>
									<li><a href="bulk/bulk_state.jsp">Upload File Status</a></li>
									<li><a href="bulk/bulk_error.jsp">Error Report</a></li>
								</ul></li>
						</ul></li>
					<li><a href="#">Product Management</a>
						<ul>
							<li><a>Category</a>
								<ul>
									<li><a href="domains/classification.jsp">Classification
											Schema Maintenance</a></li>
								</ul></li>
							<li><a>Products</a>
								<ul>
									<li><a href="#">Domain Table Maintenance</a></li>
								</ul></li>
						</ul></li>
					<li><a href="#">User Management</a>
						<ul>
							<li><a href="root/root_search.jsp">ROOT Maintenance</a></li>
							<li><a href="uric/uric_search.jsp">URIC Maintenance</a></li>
						</ul></li>
					<li><a href="#">Help</a>
						<ul>
							<li><a href="root/root_search.jsp">ROOT Maintenance</a></li>
							<li><a href="uric/uric_search.jsp">URIC Maintenance</a></li>
						</ul></li>
				</ul>

			</div>
			<div id="main">
				<div id="col1">
					<div id="col1_content" class="clearfix">
						<div style="height: 20%;">
							Include Retired <a class="btn" href="javascript:void(0);"
								onclick="$('#classification_tree').jstree('refresh',-1);"><i
								class="icon-refresh"></i> Refresh Tree</a>
						</div>
						<div style="height: 80%;"
							class="ui-accordion-content ui-helper-reset ui-widget-content">
							<div id="classification_tree" class="demo"
								style="width: 228px; height: 531px; overflow-y: scroll; overflow-x: auto;"></div>
						</div>
					</div>
				</div>
				<div id="col3">
					<div id="col3_content" class="clearfix">
						<!-- add your content here -->
						<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr,
							sed diam nonumy eirmod tempor invidunt ut labore et dolore magna
							aliquyam erat, sed diam voluptua. At vero eos et accusam et justo
							duo dolores et ea rebum. Stet clita kasd gubergren, no sea
							takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum
							dolor sit amet, consetetur sadipscing elitr, sed diam nonumy
							eirmod tempor invidunt ut labore et dolore magna aliquyam erat,
							sed diam voluptua. At vero eos et accusam et.</p>
						<table class="full">
							<caption>Table Heading</caption>
							<tbody>
								<tr>
									<th>Col 1</th>
									<th>Col 2</th>
									<th>Col 3</th>
								</tr>
								<tr>
									<th>Row 1</th>
									<td>content 1.1</td>
									<td>content 1.2</td>
								</tr>
								<tr>
									<th>Row 2</th>
									<td>content 2.1</td>
									<td>content 2.3</td>
								</tr>
							</tbody>
						</table>
					</div>
					<!-- IE Column Clearing -->
					<div id="ie_clearing">&#160;</div>
				</div>
			</div>
			<div id="footer">Footer</div>
		</div>
	</div>
</body>
<script type="text/javascript">
		$(document).ready(function($) {
			//Menu Bar
			$('#mega_menu').dcMegaMenu({
				rowItems : "4",
				speed : "fast",
				effect : "slide"
			});
			$("#mega_menu a").bind("click", function(event) {
				var $subject = $(event.target).parent();
				if ($subject.find("ul").length > 0) {
					return false;
				} else {
					//change iframe's src
					var url = $(event.target).attr("href");
					if (url != "" && url != "#") {
						$("#action_menu").hide();
						blockFrame();
						$("#demoIframe").attr("src", url);
					} else {
						alert("not finished!");
					}
					return false;
				}
			});

			var navH = $("#menu-bar").offset().top;
			$(window).scroll(function() {
				var scroH = $(this).scrollTop();
				if (scroH >= navH) {
					$("#menu-bar").css({
						"position" : "fixed",
						"top" : 0
					});
					//$("#auto").css("top", "34px").css("left", "34px");
				} else if (scroH < navH) {
					$("#menu-bar").css({
						"position" : "static",
						"margin" : "0"
					});
					//$("#auto").css("top", $("#word").position().top + $("#word").height() + 15);
				}
			});
		});
	</script>

<script type="text/javascript">
		$(function() {
			$.ajaxSetup({cache:false});//这个是为了树的准确性做的一个缓存区清理的工作
			$("#classification_tree").jstree({ // initialize
				"themes" : {
					"theme" : "apple",
					"dots" : true,
					"icons" : true
				},
				"plugins" : ["themes", "json_data", "ui", "crrm", "hotkeys"],
				"json_data" : {
					// This tree is ajax enabled - as this is most common, and maybe a bit more complex
					// All the options are almost the same as jQuery's AJAX (read the docs)
					"ajax" : {
						// the URL to fetch the data
						"url" : "", //"treeAction.action",
						// the `data` function is executed in the instance's scope
						// the parameter is the node being loaded
						// (may be -1, 0, or undefined when loading the root nodes)
						"data" : function(n) {
							// the result is fed to the AJAX request `data` option
							return {
								"operation" : "get_children",
								"id" : n.attr ? n.attr("id").replace("node_", "") : 1
							};
						}
					}
				},
				// each plugin you have included can have its own config object
				"core" : { "initially_open" : [ "tree_1", "tree_11", "tree_12" ] }
				// it makes sense to configure a plugin only if overriding the defaults
			}).bind("loaded.jstree", function(event, data) {
				// you get two params - event & data - check the core docs for a detailed description
			}).bind("click.jstree", function(event) {
				var eventNodeName = event.target.nodeName;
				if (eventNodeName == "INS") {
					return;
				} else if (eventNodeName == "A") {
					var $subject = $(event.target).parent();
					var id = $subject.attr("id") ? $subject.attr("id").replace("node_", "") : 1;
					alert(id);
				}
			});

			//window.parent.unblockFrame();
		});
	</script>
</html>